tags: 2019年鐵人賽 、 JS 、 YouDon'tKnowJS

輸出(output)

• about:blank
  純空白分頁
  

• console.log(..)
  print在控制台上
  

• alert(..)
  跳出提示框並print在上面
  

輸入(input)

• prompt(..)
  跳出提示框，user輸入的東西可當成變數使用

var age = prompt('what is your age?')
console.log('age is' + ' ' + age)
alert('age is' + ' ' + age)

運算子(operators)

• 使用運算子来操作值
• 指定(Assignment)
  =
• 數學(Math)
  + , - , * , /
• 複合指定(Compound Assignment)
  += , -= , *= , /=

var a += 2 
//等同下面
var a = a + 2

• 遞增與遞減(Increment/Decrement)

  1. ++ , --

  2. a1++是先給值再計算，++a2是先計算再給值
     

     以C++來看a++和++a的運作，回傳值不ㄧ樣
     

• 相等性(Equality):

  1. ==跟===都是比較值的相等性，差別在於前者允許值可以強制轉型，後者不允許
     

更多比較：JS-Equality-Table

• 不相等性(inequality):
  1. < , > , <= , >=
  2. 兩個不同type的值相比，有一個值可能被強制轉型成NaN這個無效數字值

var a = 11;
var b = "12";
var c = "13";

a < b;		// true
b < c;		// true

var x = 2;
var y = "hi";

x < y;		// false，y被強制轉型成NaN
x > y;		// false，y被強制轉型成NaN
x == y;		// false，y被強制轉型成NaN

• 比較(Comparison)
  < , > , <= , >=

• 邏輯(Logical)
  && , ||

值(values)與型別(types)

• JS內建的type
  1. 字串 (string)
  2. 數值 (number)
  3. 布林 (boolean)
  4. undefined：若變數沒有指定初始值，則會指定undefined為初始值
  5. null
  6. 物件 (object)
  7. symbol (ES6新增)
• 使用typeof運算子(operator)檢查值的type

var a;
typeof a;			// "undefined"

a = "hi";
typeof a;			// "string"

a = 42;
typeof a;			// "number"

a = true;
typeof a;			// "boolean"

a = null;
typeof a;			// "object",這是JS中奇怪的bug

a = { b: "c" };
typeof a;			// "object"

• 型別之間做轉換需要強制轉型(coercion)，強制轉型有兩種：

  1. 明確的(explicit)
     
  2. 隱含的(implicit)
     

• 以下值被強制轉換成boolean值時，視為false :

  1. undefined
  2. null
  3. 0
  4. ''(空字串)
  5. NaN
  6. false
     

變數(variables)

• 使用變數當容器儲存資料
• 宣告(declare)變數
  1. var
  2. let
  3. const：
     • 依慣例，作為常數宣告時，首字母大寫，每個字詞以底線_隔開
• 宣告(declare)跟定義(define)不一樣，var x這是declare，x=10這是define

區塊(blocks)

• 一個區塊用一組大括號{}包含
• 結尾不需要分號;

範圍(scope)

• var

  1. 若不宣告會自動提升變成全域
     

  2. 在function內宣告就是區域變數，scope只在function內
     
     

• let:

  1. let只作用在它們被定義的區塊範圍
     
  2. let沒有hoisting作用
     

條件式(conditionals)

• 使用條件式做判斷
• if(..){..}

var JasonKg = 101
if(JasonKg > 100){
    console.log('Jason is 操')
}

• switch(..){..}

var HenryKg = 90
switch (HenryKg) {
    case 90:
    case 95:
      console.log('我知道要＋5')
      break;
    case 96:
      console.log('你比Jason瘦但ㄧ樣操')
      break;
    default:
      console.log('恭喜你跟Jasonㄧ樣是操胖')
  }

迴圈(loops)

• 迴圈{}裡的程式每次執行時，就稱做一次迭代(iteration)
• 迴圈會重複執行到條件判斷為false為止
• 可用break停止迴圈
• for(..){}
  括號裡需有三個子句：初始化(var i=0)，條件測試(i<=9)，更新(i=i+1)

for (var i = 0; i <= 9; i = i + 1) {
	console.log( i );
}
// 0 1 2 3 4 5 6 7 8 9

• while(..){..}
  條件一旦判斷為false，就不進{}裡執行
  

• do{..}while(..);
  條件就算判斷為false，還是會進{}裡執行一次
  

物件(object)

• 關聯式容器
• object是一種複合值，可透過屬性(property)持有其他值

var obj = {
	a: "hello world",
	b: 42,
	c: true
};

//透過.訪問屬性
obj.a;		// "hello world"
obj.b;		// 42
obj.c;		// true

//透過[]訪問屬性
obj["a"];	// "hello world"
obj["b"];	// 42
obj["c"];	// true

陣列(array)

• 可透過索引(indexed)持有其他值
• 順序式容器
• 陣列的type被認為是object的子類型(subtypes)

var arr = [
	"hello world",
	42,
	true
];

arr[0];			// "hello world"
arr[1];			// 42
arr[2];			// true
arr.length;		// 3

typeof arr;		// "object"

函式(function)

• function的type被認為是object的子類型(subtypes)
• 使用function提出可重複使用的邏輯block

參考來源

• YDKJS-github